<template>
    <div class="cell-item">
        <LabelRow v-bind:label="label" v-bind:text="'共'+dataList.length+'条记录'"></LabelRow>
        <ul class="cell-ul" id="yjtxItem">
            <div v-for="(item,index) in dataList" :key="index" class="cell-li">
                <i v-bind:class="['tag',item.type]"></i>
                <div class="cell-label">
                    <div class="text-over">
                        <span class="tel">{{item.handlePersonName}}</span>
                        <span class="warn-des">的审批件待转发</span>
                    </div>
                </div>
                <div>
                    <span class="warn-time">{{item.warnTime}}</span>
                </div>
            </div>
            <div v-if="!dataList.length" class="no-data">
                <img src="../../assets/no-data.png" alt="">
            </div>
        </ul>
    </div>
</template>
<script>
import LabelRow from "../common/labelRow.vue";
import { tyGetWarnInfo, findByDictCode } from "../../config/api";
import {
    getDateStr,
    addScrollEvent,
    removeScrollEvent,
    getPastTime
} from "../../utils";
import Pubsub from "../../utils/pubsub";
export default {
    components: {
        LabelRow
    },
    data() {
        return {
            label: {
                url: require("../../assets/unifyAcceptWorkbench/yjtx-icon.png"),
                label: "效能监督"
            },
            request: {
                pageNum: 1,
                pageSize: 999,
                type:"all"
            },
            totalPage: 2, //总页数
            scrollFlag: false, //是否滚动到底部，
            dataList: []
        };
    },
    mounted: function() {
        this.getDir("warnTimeLevel");
        this.pubsub_token1 = Pubsub.subscribe("WARNING",()=>{
            this.getDir("warnTimeLevel");
        })
        // addScrollEvent("yjtxItem",this.handleScroll)
        // document.getElementById("yjtxItem").addEventListener('scroll', this.handleScroll, true);
    },
    destroyed() {
        this.timer && clearInterval(this.timer);
        this.pubsub_token1 && Pubsub.unsubscribe(this.pubsub_token1);
        // removeScrollEvent("yjItem");
    },
    methods: {
        /**
            获取数据字典
         */
        getDir(type) {
            findByDictCode({ dictCode: type }).then((result = {}) => {
                let data = result.data || [];
                this.warnDic = data;
                this.getList();
            });
        },
        /**
         * 获取预警提醒列表
         */
        getList() {
            tyGetWarnInfo(this.request).then((result = {}) => {
                let { rows } = result;
                this.scrollFlag = false;
                // this.warnDic
                rows.map(item => {
                    let min = getPastTime(item.createTime);
                    let type = this.getWarnType(min);
                    item.type = type;
                    item.warnTime = getDateStr(item.createTime);
                });
                this.dataList = rows;
                this.totalPage = result.totalPage;
                this.timer = setInterval(this.setWarnTime, 1000 * 60);
            });
        },
        /**
         * 换算警告时间
         */
        setWarnTime() {
            let tamp = new Date().getTime();
            this.dataList.map(item => {
                let min = getPastTime(item.createTime);
                let type = this.getWarnType( min);
                item.type = type;
                item.warnTime = getDateStr(item.createTime);
            });
        },
        getWarnType(min) {
            let type = "green";
            if (min > this.warnDic[1].dictDataCode) {
                type = this.warnDic[2].dictDataName;
            } else if (min > this.warnDic[0].dictDataCode) {
                type = this.warnDic[1].dictDataName;
            } else if (min <= this.warnDic[0].dictDataCode) {
                type = this.warnDic[0].dictDataName;
            }
            return type;
        },
        handleScroll: function(h1, h2) {
            if (this.scrollFlag) {
                return;
            }
            if (h1 > h2) {
                this.scrollFlag = true;
                let { pageNum } = this.request;
                if (pageNum < this.totalPage) {
                    ++this.request.pageNum;
                    this.getList();
                }
            }
        }
    }
};
</script>

<style lang="scss" scoped>
@import "../../css/unifyAcceptWorkbench.scss";
.tag {
    width: 20px;
    height: 14px;
    border-radius: 7px;
    margin-right: 20px;
}
.yellow {
    background-color: yellow;
}
.green {
    background-color: #009944;
}
.red {
    background-color: red;
}

.tel {
    color: #1a36a9;
    margin-right: 3px;
}
.warn-time {
    font-size: 14px;
    color: #1a36a9;
    span {
        font-size: 14px;
        color: #888;
    }
}
</style>
